<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>controller</title>
<script src="../lib/jquery/jquery-1.10.2.js"></script>
<script src="../lib/angularjs/angular.min.js"></script>
</head>
<body ng-app="app01">
    <div link>http://www.baidu.com</div>
</body>
<script>
    var app=angular.module("app01",[]);
    app.directive('link', function() {
        return {
            restrict: 'EA',
            transclude: true,
            controller:
                function($scope, $element, $transclude, $log) {
                    $transclude(function(clone) {
                        var a = angular.element('<a>');
                        a.attr('href', clone.text());
                        a.text(clone.text());
                        $log.info("Created new a tag in link directive");
                        $element.append(a);
                    });
                }
        };
    });
</script>
</html>